<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
  <title>RuiDaoExam-首页</title>
<!--  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <link rel="stylesheet" type="text/css" href="./styles.txt">-->
  <link rel="stylesheet" href="../css/res/layui/css/layui.css" th:href="@{static/css/res/layui/css/layui.css}" media="all">
  <link rel="stylesheet" href="../css/res/static/css/index.css" th:href="@{static/css/res/static/css/index.css}" media="all">
<!--	<link rel="stylesheet" href="../css/res/static/css/base.min.css" media="all">
  <link rel="stylesheet" href="../css/res/static/css/index1.css" media="all">
  <link rel="stylesheet" href="../css/res/static/css/sets.min.css" media="all">
	<link rel="stylesheet" href="../css/res/static/css/app.css" media="all"-->>
  <!--<script src="layui/layui.js"></script>-->
  <script type="text/javascript" src="../css/res/static/js/jquery-1.8.3.min.js" th:src="@{static/css/res/static/js/jquery-1.8.3.min.js}" ></script>
</head>
<body>
  <!-- nav部分 -->
  <div class="nav index">
    <div class="layui-container">
      <!-- 公司logo -->
      <div class="nav-logo">
        <a href="home" th:href="@{home}">
          <img src="../css/res/static/img/logo3.png" th:src="@{static/css/res/static/img/logo3.png}" alt="RuiDaoTest">
        </a>
      </div>
      <div class="nav-list">
        <button>
          <span></span><span></span><span></span>
        </button>
        <ul class="layui-nav" lay-filter="">
          <li class="layui-nav-item layui-this"><a href="/tohome" th:href="@{/tohome}">首页</a></li>
          <li class="layui-nav-item"><a href="/toshangcheng" th:href="@{/toshangcheng}">商城</a></li>
<!--           <li class="layui-nav-item"><a href="news.html">服务说明</a></li> -->
          <li class="layui-nav-item"><a href="/todenglu" th:href="@{/todenglu}">登录</a></li>
          <li class="layui-nav-item"><a href="/tozhuce" th:href="@{/tozhuce}">注册</a></li>
          <li class="layui-nav-item"><a href="/tozhuce" th:href="@{/toentrance}">考试入口</a></li>
        </ul>
      </div>
    </div>
  </div>

  <!-- main部分 -->
  <br />
  <br />
  <div class="tlinks">Collect from <a href="http://www.cssmoban.com/" >网页模板</a></div>
  <div class="main-product">
    <div class="layui-container">
    	<p align="center" style="font-size:40px; color: #484848;">要考试，用<span style="color: #2db5a3;">RuiDaoExam</span></p><br />
      <p align="center" style="font-size:20px; color: #484848;">在线考试   在线题库   在线课堂</p>
      <p align="center" style="font-size:20px; color: #484848;">任何时间、任何地点、任何规模、任何场景</p><br />
      <div class="layui-row layui-col-space25">
        <div class="layui-col-sm6 layui-col-md3">
          <div class="yongzaiqiye">
	          <div class="content">
	            <div><img src="../css/res/static/img/Big_icon1.png" th:src="@{static/css/res/static/img/Big_icon1.png}"></div>
	            <div class="qiyexinxi">
	              <p class="label">用在企业</p>
	              <p align="left">大规模校招在线笔试，企业级在线考试系统.考核宝-员工考核、技能题库、晋升考核。培训宝-内训考试、销售考试、客服考试。</p>
	              <a class="qiyechakan" href="../pages/user/homePage.html" th:href="@{static/pages/user/homePage.html}">了解更多 ></a>
	            </div>
	          </div>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="yongzaixuexiao">
	          <div class="content">
	            <div><img src="../css/res/static/img/Big_icon2.png" th:src="@{static/css/res/static/img/Big_icon2.png}"></div>
	            <div class="xuexiaoxinxi">
	              <p class="label">用在学校</p>
	              <p align="left">最全试题库，随用随取的题库系统.考试宝-布置作业、模拟试卷、错题集锦 。题库宝-行测考试、英语题库、数学题库。</p>
	              <a class="xuexiaochakan" href="../pages/user/homePage.html" th:href="@{static/pages/user/homePage.html}">了解更多 ></a>
	            </div>
	          </div>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="zigezhengchongci">
	          <div class="content">
	            <div><img src="../css/res/static/img/Big_icon3.png" th:src="@{static/css/res/static/img/Big_icon3.png}"></div>
	            <div class="zigezhengxinxi">
	              <p class="label">考证冲刺</p>
	              <p align="left">以考生身份注册，模拟考试系统专为你开启。备考cma考试，国家司法考试、证券分析师、cfa考试、计算机二级考试……</p>
	              <a class="zigezhengchakan" href="../pages/user/homePage.html" th:href="@{static/pages/user/homePage.html}">了解更多 ></a>
	            </div>
	          </div>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="yanxuechongci">
	          <div class="content">
	            <div><img src="../css/res/static/img/Big_icon4.png" th:src="@{static/css/res/static/img/Big_icon4.png}"></div>
	            <div class="yanxuexinxi">
	              <p class="label">研学冲刺</p>
	              <p align="left">以考生身份注册，模拟考试系统专为你开启。备考四六级考试、大学生课程评测、大学生日常测、本科生入学考试、研究生入学考试……</p>
	              <a class="yanxuechakan" href="../pages/user/homePage.html" th:href="@{static/pages/user/homePage.html}">了解更多 ></a>
	            </div>
	          </div>
          </div>
        </div>
      </div>
    </div>
  </div>
    <!-- banner部分 -->
  <div style="height: 480px;">
    <div class="layui-carousel" id="banner">
      <div carousel-item>
        <div>
          <img src="../css/res/static/img/banner1.jpg" th:src="@{static/css/res/static/img/banner1.jpg}">
          <div class="panel">
          	<br /><br />
            <p align="center" style="font-size:40px; color: #484848; letter-spacing: 5px;">远程监考</p><br /><br />
      			<p align="center" style="font-size:20px; color: #484848; letter-spacing: 3px;">智能电子监考，远程考试成绩可信度可达99.99%</p>
          </div>
        </div>
				<div>
          <img src="../css/res/static/img/banner2.jpg" th:src="@{static/css/res/static/img/banner2.jpg}">
          <div class="panel">
            <br /><br />
            <p align="center" style="font-size:40px; color: #484848; letter-spacing: 5px;">永久免费，不限量</p><br /><br />
      			<p align="center" style="font-size:20px; color: #484848; letter-spacing: 3px;">不限考试功能、不限考试人次、永久免费</p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="main-service">
    <div class="layui-container">
    	<br /><br /><br /><br />
    	<p align="center" style="font-size:40px; color: #484848;">要考试，用<span style="color: #2db5a3;">RuiDaoTest</span></p><br /><br />
     <!-- <p class="title">为客户打造完美的<span>专业服务</span></p>-->
      <div class="layui-row layui-col-space25 layui-col-space80">
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../css/res/static/img/home_img1.jpg" th:src="@{static/css/res/static/img/home_img1.jpg}"></div>
            <div class="content-right">
              <p class="label">1 对 1 前端指导</p>
              <span></span>
              <p>更有多个包含不同主题的Web组件，可快速构建界面出色、体验优秀的跨屏页面，大幅提升开发效率。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../css/res/static/img/home_img2.jpg" th:src="@{static/css/res/static/img/home_img2.jpg}"></div>
            <div class="content-right">
              <p class="label">1 对 1 前端指导</p>
              <span></span>
              <p>更有多个包含不同主题的Web组件，可快速构建界面出色、体验优秀的跨屏页面，大幅提升开发效率。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../css/res/static/img/home_img3.jpg" th:src="@{static/css/res/static/img/home_img3.jpg}"></div>
            <div class="content-right">
              <p class="label">1 对 1 前端指导</p>
              <span></span>
              <p>更有多个包含不同主题的Web组件，可快速构建界面出色、体验优秀的跨屏页面，大幅提升开发效率。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../css/res/static/img/home_img4.jpg" th:src="@{static/css/res/static/img/home_img4.jpg}"></div>
            <div class="content-right">
              <p class="label">1 对 1 前端指导</p>
              <span></span>
              <p>更有多个包含不同主题的Web组件，可快速构建界面出色、体验优秀的跨屏页面，大幅提升开发效率。</p>
            </div>
          </div>
        </div>
      </div>
      <div class="service-more"><a class="chakankengduo" href="">查看更多</a></div>
    </div>
  </div>
  
  <!--活动添加区域-->
<div class="act-content">
    <div class="act-content-wrap">
        <div class="act-bg"></div>
        <div class="act-content-box">
            <a href="../pages/user/goodslist.html" th:href="@{static/pages/user/goodslist.html}"><img src="../css/res/static/img/act-banner-1.png" th:src="@{static/css/res/static/img/act-banner-1.png}"></a>
            <div class="stat-box">
            	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <span style="line-height: 1.42857143;" th:text="${session.getStudentNum}"></span>
                <span style="line-height: 1.42857143; margin-left: -30px;"><i> 学生</i></span>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <span style="line-height: 1.42857143;" th:text="${session.getTeacherNum}"></span>
                <span style="line-height: 1.42857143; margin-left: -30px;"><i> 教师</i></span>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <span style="line-height: 1.42857143;" th:text="${session.getQuestionNum}"></span>
                <span style="line-height: 1.42857143; margin-left: -30px;"><i> 题目</i></span>
            </div>
            <a class="act-content-close" title="关闭">×</a>
        </div>
    </div>
</div>
<div class="act-content-hide" style="display:none;">
    <a><img style="height: 100px" src="../css/res/static/img/act-banner-close.png" th:src="@{static/css/res/static/img/act-banner-close.png}"></a>
</div>
<!--活动添加区域结束-->

  <!-- footer部分 -->
<!--   <div class="footer">
    <div class="layui-container">
      <div class="layui-row footer-contact">
        <div class="layui-col-sm10 layui-col-lg11">
          <div class="layui-row">
            <div class="layui-col-sm6 layui-col-md8 layui-col-lg9">
              <p class="contact-top"><i class="layui-icon layui-icon-cellphone"></i>&nbsp;400-8888888&nbsp;&nbsp;&nbsp;(9:00-18:00)</p>
              <p style="left: 50%;" contact-bottom><i class="layui-icon layui-icon-home"></i>&nbsp;88888888@163.com</span></p>
            </div>
            <div class="layui-col-sm6 layui-col-md4 layui-col-lg3">
              <p class="contact-top"><span class="right">111111111</span></p>
            </div>
          </div>
        </div>
      </div>s
    </div>
  </div> -->
<script src="../css/res/layui/layui.js" th:src="@{static/css/res/layui/layui.js}"></script>
<!--[if lt IE 9]>
  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
  layui.config({
    base: 'static/css/res/static/js/' 
  }).use('firm'); 
</script>

<script>
	$("[class=yongzaiqiye]").mouseover(function(){
		$("[class=qiyexinxi]").children().css("color","#000000");
		$("[class=qiyechakan]").css("color","#009688");
	})
</script>
<script>
	$("[class=yongzaiqiye]").mouseout(function(){
		$("[class=qiyexinxi]").children().removeAttr("style");
	})
</script>

<script>
	$("[class=yongzaixuexiao]").mouseover(function(){
		$("[class=xuexiaoxinxi]").children().css("color","#000000");
		$("[class=xuexiaochakan]").css("color","#009688");
	})
</script>
<script>
	$("[class=yongzaixuexiao]").mouseout(function(){
		$("[class=xuexiaoxinxi]").children().removeAttr("style");
	})
</script>

<script>
	$("[class=zigezhengchongci]").mouseover(function(){
		$("[class=zigezhengxinxi]").children().css("color","#000000");
		$("[class=zigezhengchakan]").css("color","#009688");
	})
</script>
<script>
	$("[class=zigezhengchongci]").mouseout(function(){
		$("[class=zigezhengxinxi]").children().removeAttr("style");
	})
</script>

<script>
	$("[class=yanxuechongci]").mouseover(function(){
		$("[class=yanxuexinxi]").children().css("color","#000000");
		$("[class=yanxuechakan]").css("color","#009688");
	})
</script>
<script>
	$("[class=yanxuechongci]").mouseout(function(){
		$("[class=yanxuexinxi]").children().removeAttr("style");
	})
</script>

<script>
	$("[class=chakankengduo]").mouseover(function(){
		$("[class=chakankengduo]").css("background","#009688");
	})
</script>
<script>
	$("[class=chakankengduo]").mouseout(function(){
		$("[class=chakankengduo]").removeAttr("style");
	})
</script>

<script>
	$("[class=act-content-close]").click(function(){
		$("[class=act-content]").hide();
		$("[class=act-content-hide]").removeAttr("style");
	})
</script>
<script>
	$("[class=act-content-hide]").click(function(){
		$("[class=act-content]").show();
		$("[class=act-content-hide]").hide();
	})
</script>

<style>
        .btn-index {
            padding: 10px 25px;
            border: 1px solid #fff;
            background: transparent;
            color: #fff;
            font-size: 16px;
        }

        .btn-index:hover {
            color: #009EE7;
            border-color: #fff;
            outline: 0 !important;
            background-color: #fff;
        }

        .mt90 {
            margin-top: 90px;
        }

        .act-content {
            z-index: 100;
            position: fixed;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 100px;
            overflow: hidden;
        }
				
				.act-content-hide {
            z-index: 100;
            position: fixed;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 100px;
            overflow: hidden;
        }
        
        .act-content-wrap {
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
        }

        .act-content .act-bg {
            z-index: -200;
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(5, 18, 35, .5);
        }

        .act-content .act-content-box {
            position: relative;
            width: 100%;
            min-width: 1100px;
            height: 64px;
            font-size: 12px;
            color: #333;
        }

        .act-content-box a {
            display: block;
            margin-left: 30px;
        }

        .act-content-box .stat-box {
            position: absolute;
            left: 40%;
            margin-top: 10px;
            padding-left: 30px;
        }

        .act-content-box .stat-box > span {
            color: #e8e8e8;
            display: inline-block;
            -webkit-font-smoothing: antialiased;
            font-size: 32px;
            margin-right: 40px;
        }
        .act-content-box .stat-box > span >i{
            font-size: 15px;
        }
        .act-content-box a img {
            position: absolute;
            bottom: -4px;
            height: 100px;
        }

        .act-content-box a.act-content-close {
            position: absolute;
            top: 10px;
            right: 30px;
            font-size: 38px;
            line-height: 1.2;
            font-family: Simsun;
            color: #9aa1a8;
            outline: 0 none;
        }

        .act-content-box a.act-content-close:hover {
            color: #ffffff;
            /*transform: rotate(180deg);*/
        }

        /*.main-footer {*/
        /*margin-bottom: 120px;*/
        /*}*/

        @keyframes hide {
            to {
                transform: translateX(-100%);
                opacity: 0;
            }
        }

        @keyframes show {
            to {
                transform: translateX(0);
                opacity: 1;
            }
        }

        @keyframes hide-status {
            to {
                transform: translateX(0);
            }

        }

        @keyframes show-status {
            from {
                transform: translateX(0);
            }
            to {
                transform: translateX(-100%);
            }

        }

        .hide-act {
            animation: .4s hide ease-in-out 1;
            animation-fill-mode: forwards
        }

        .hide-content {
            animation: .4s hide-status ease-in-out 1;
            animation-fill-mode: forwards;
            animation-delay: .3s;
        }

        .show-act {
            transform: translateX(-100%);
            animation: .4s show ease-in-out 1;
            animation-fill-mode: forwards;
            animation-delay: .3s;
        }

        .show-content {
            animation: .4s show-status ease-in-out 1;
            animation-fill-mode: forwards;
        }
    </style>
    
</body>
</html>